React = require('react')
Card = require('antd-mobile/lib/card')
Flex = require('antd-mobile/lib/flex')
Icon = require('antd-mobile/lib/icon')
Toast = require('antd-mobile/lib/toast')
RefreshControl = require('antd-mobile/lib/refresh-control')
{View,Image,Text,ScrollView,TouchableHighlight,StyleSheet,Navigator,ListView,TouchableOpacity} = require('react-native')
Dimensions = require('Dimensions')
{ width, height } = Dimensions.get('window')
{View} = require('react-native')
{fetchGetList,fetchRefreshList} = require('../actions/page_gkcsb.js')
{connect} = require('react-redux')
_ = require('underscore')
moment = require('moment')

backImg = require('../img/back.png')
searchIcon = require('../img/search_white.png')

basePage = require('../mixins/basePage.js')

Page_Gkcsb = React.createClass

  mixins:[basePage]

  _renderHeader:->
      <View style={{flexDirection:'row',flex:0,height:60,alignItems:'center', justifyContent:'center',backgroundColor:'#0066FF'}}>
        <View style={{flex:1,padding:10}}>
          <TouchableOpacity onPress={=>@props.navigator.pop()}>
            <Image source={backImg}  style={{height:30,width:30,resizeMode:'contain'}}/>
          </TouchableOpacity>
        </View>
        <View style={{flex:1,justifyContent:'center',alignItems:'center'}}>
          <Text style={{fontSize:20,color:'#ffffff'}}>当日潮水</Text>
        </View>
        <View style={{flex:1,alignItems:'flex-end',padding:10}}>
          <TouchableOpacity onPress={@_showActionSheet}>
          </TouchableOpacity>
        </View>
      </View>
  formatTime:(date)->
    t = moment(date)
    if t.isValid() then t.format('HH:mm') else ""
  _renderRow:(rowData,sectionID,rowID,highlightRow)->
      debugger
      bColor = if rowID%2 isnt 0 then "#f9f9f9" else "#ffffff"
      <View key={rowData.CHPLACE} style={{flexDirection:'row',padding:20, backgroundColor:bColor,justifyContent:'center',alignItems:'center'}}>
        <View style={{flex:1,width:60}}>
          <Text>{rowData.CHPLACE}</Text>
        </View>
        <View style={{flex:1}}>
          <Text>{@formatTime rowData.DTHIGHTIDETIME1}</Text>
          <Text>{@formatTime rowData.DTHIGHTIDETIME2}</Text>
        </View>
        <View style={{flex:1}}>
          <Text>{rowData.NMHIGHTIDE1}</Text>
          <Text>{rowData.NMHIGHTIDE2}</Text>
        </View>
        <View style={{flex:1}}>
          <Text>{@formatTime rowData.DTLOWTIDETIME1}</Text>
          <Text>{@formatTime rowData.DTLOWTIDETIME2}</Text>
        </View>
        <View style={{flex:1}}>
          <Text>{rowData.NMLOWTIDE1}</Text>
          <Text>{rowData.NMLOWTIDE2}</Text>

        </View>
      </View>
  
  _renderListColumns:->
    <View style={{ flexDirection:'row',backgroundColor:'#f9f9f9',padding:20,justifyContent:'center',alignItems:'center'}}>
      <View style={{flex:1,width:60}}>
        <Text style={{fontWeight:'bold'}}>潮汐站</Text>
      </View>
      <View style={{flex:1}}>
        <Text style={{fontWeight:'bold'}}>HW</Text>
      </View>
      <View style={{flex:1}}>
        <Text style={{fontWeight:'bold'}}>H</Text>
      </View>
      <View style={{flex:1}}>
        <Text style={{fontWeight:'bold'}}>LW</Text>
      </View>
      <View style={{flex:1}}>
        <Text style={{fontWeight:'bold'}}>H</Text>
      </View>
    </View>
styles = StyleSheet.create
  row:
    flexDirection:'column'
    justifyContent:'center'
    padding:10
    backgroundColor:'#F6F6F6'
  text:
    flex:1

mapStateToProps = (state)->
  debugger
  list:state.page_gkcsb.list
  isLoading:state.page_gkcsb.isLoading
  completed:state.page_gkcsb.completed
  refreshing:state.page_gkcsb.refreshing
  lastFetchTime:state.page_gkcsb.lastFetchTime
  connected:state.appState.connected
mapDispatchToProps = (dispatch,wonProps)->
  fetchGet:(pageNum)->
    dispatch fetchGetList(pageNum)
  fetchRefresh:->
    dispatch fetchRefreshList()

module.exports = connect(mapStateToProps,mapDispatchToProps)(Page_Gkcsb)
